.notice-list-wrapper {
    height: 100%;
    background: #f2f2f2;
    display: flex;
    flex-direction: column;

    // 头部
    .top-wrapper {
        padding: 0 30rpx;
        box-sizing: border-box;
        background: #ffffff;

        .search-wrapper {
            margin-bottom: 20rpx;
            display: flex;
            justify-content: space-between;
            align-items: center;

            .search {
                flex: 1;
                padding: 11rpx 27rpx 12rpx;
                height: 58rpx;
                box-sizing: border-box;
                background: #f2f2f2;
                border-radius: 30rpx;
                display: flex;
                align-items: center;

                .ico-search {
                    width: 36rpx;
                    height: 35rpx;
                    display: block;
                    margin-right: 10rpx;

                    .ico-search-img {
                        width: 36rpx;
                        height: 35rpx;
                    }
                }

                .input {
                    flex: 1;
                    font-size: 26rpx;
                    color: #333333;
                    font-weight: 400;
                }
            }

            .clear {
                width: 41rpx;
                height: 42rpx;
                margin-left: 20rpx;

                .ico-clear {
                    width: 41rpx;
                    height: 42rpx;
                    display: block;
                }
            }
        }
    }

    // 列表
    .list-wrapper {
        position: relative;
        flex: 1;
        padding: 0 0 20rpx;
        box-sizing: border-box;
        overflow: hidden;

        .list-item {
            padding: 42rpx 30rpx 30rpx;
            margin: 48rpx 30rpx 0;
            border-radius: 20rpx;
            background: #ffffff;
            border-radius: 20rpx;

            .left {
                position: relative;

                .time {
                    position: absolute;
                    top: -72rpx;
                    left: 50%;
                    transform: translateX(-50%);
                    height: 20rpx;
                    font-size: 20rpx;
                    font-weight: 400;
                    color: #666666;
                    text-align: center;
                    line-height: 20rpx;
                }

                .read-flag {
                    position: absolute;
                    top: 0;
                    left: -10rpx;
                    z-index: 99;
                    width: 10rpx;
                    height: 10rpx;
                    background: #fe0302;
                    border-radius: 50%;
                }

                .title {
                    font-size: 30rpx;
                    font-weight: 400;
                    color: #333333;
                    margin-bottom: 20rpx;
                }

                .content {
                    font-size: 24rpx;
                    font-weight: bold;
                    color: #999999;
                    margin-bottom: 16rpx;

                    &-ellipsis {
                        display: -webkit-box;
                        height: 24rpx;
                        max-height: 24rpx;
                        line-height: 1;
                        -webkit-line-clamp: 1;
                        text-overflow: ellipsis;
                        overflow: hidden;
                        -webkit-box-orient: vertical;
                    }

                    &.highlight {
                        color: #5769af;
                    }
                }

                .illustrate-box {
                    background: #f1f3fd;
                    padding: 20rpx;
                    border-radius: 10rpx;
                }

                .illustrate {
                    font-size: 24rpx;
                    font-weight: 400;
                    color: #999999;

                    &-black {
                        color: #333;
                    }
                }

                .line-chart {
                    height: 350rpx;
                    margin-top: 30rpx;
                }
            }
        }
    }

    // 暂无数据
    .no-data-wrapper {
        height: 100%;
        padding: 20rpx 0;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;

        .no-data-img {
            width: 261rpx;
            height: 269rpx;
        }

        .no-data-txt {
            margin-top: 40rpx;
            font-size: 26rpx;
            font-weight: 400;
            color: #333333;
        }
    }
}